<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 网站管理 <span class="c-gray en">&gt;</span> 标签管理</nav>
	<div id="sectionContent" class="Hui-article">
		<article class="cl pd-20">
			<div class="text-c">
					标签名称:<input type="text" id="name" class="input-text" style="width:150px">
					<a href="javascript:;" class="btn btn-success" v-on:click="search()"><i class="Hui-iconfont">&#xe709;</i> 查询</a>
			</div>
			<div class="mt-20">
				<table class="table table-border table-bordered table-bg">
					<thead>
						<tr><th colspan="10" scope="col">
								<a href="#!view/cms/ltag/ltag-add.html" class="btn size-M btn-primary"><i class="Hui-iconfont">&#xe604;</i> 添加</a>
						</th></tr>
						<tr class="text-c">
							<th>ID</th>
							<th>标签名称</th>
              <th>标签备注</th>
              <th>排序</th>
              <th>创建时间</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
            <tr class="text-c" v-for="row in result.content">
							<td>{{row.id}}</td>
              <td>{{row.ltName}}</td>
              <td>{{row.ltNote}}</td>
              <td>{{row.sorting}}</td>
              <td>{{row.createTime | formatDate}}</td>
							<td>
								<a href="#!view/cms/ltag/ltag-edit.html?id={{row.id}}"><i class="Hui-iconfont">&#xe60c;</i>编辑</a>
								<a v-on:click="deleteData(row.id)" style="cursor:pointer"><i class="Hui-iconfont">&#xe6e2;</i>删除</a>
							</td>
						</tr>
					</tbody>
				</table>
				<div class="cl pd-5 bg-1 bk-gray mt-20">
	          <span class="l">当前显示{{currentPageNumber}}/{{totalPage}}页,共{{totalSize}}条记录</span>
						<div id="Pagination" class="pagination r"/>
	      </div>
			</div>
		</article>
	</div>
<script>
      new Vue({
          el:'#sectionContent',
          http: authorization(),
          data:{
              result:{},
              pageSize:10,
              totalPage:1,
              totalSize:0,
              currentPageNumber:1
          },
          created:function(){
              this.search();
          },
          methods:{
              deleteData:function(labelTagId){
                  if(!confirm("你确认删除数据吗？")){
                      return;
                  }
                  this.$http.delete('/restful/cms/v1.0/ltag?labelTagIds='+labelTagId).then((response) => {
                      this.search();
                  }).catch(function(response) {
                      alert(errorMsg(response));
                  });
              },
              pageselectCallback:function(currentPage){
                  if(currentPage == -1){
                      return true;
                  }
                  this.loadGrid(currentPage + 1,false);
                  return false;
              },
              search:function(){
                  this.loadGrid(1,true);
                  return;
              },
              loadGrid:function(pageNum,pagination){
                  this.currentPageNumber = pageNum;
                  this.$http.get('/restful/cms/v1.0/ltag/'+this.currentPageNumber+'/'+this.pageSize+"?ltName="+$("#name").val()).then((response) => {
                      var content = responseObj(response).data;
                      this.result = content;
                      this.totalPage = content.totalPage;
                      this.totalSize = content.totalSize;
											if(pagination){
                            $("#Pagination").pagination(this.totalSize, {
                                current_page: -1,//当前选中的页面
                                num_edge_entries: 2, //两侧显示的首尾分页的条目数
                                num_display_entries: 5, //主体页数
                                link_to: 'javascript:void(0);',
                                items_per_page: this.pageSize,//每页显示数量
                                callback: this.pageselectCallback,
                                prev_text:'上一页',
                                next_text:'下一页'
                            });
                        }
                  }).catch(function(response) {
                      alert(errorMsg(response));
                  });
              }
          },
          filters: {
              formatDate:function(time) {
                  return new Date(time).format("yyyy-MM-dd hh:mm:ss");
              }
          }
      });
  </script>
